<template>
	<view class="">
		<u-navbar :is-back="true" :border-bottom="false" title="设备展示" height="46" title-color="#333" :title-bold="true"
		 :title-size="36">
		</u-navbar>
		<u-gap height="20" bg-color="#F7F7F7"></u-gap>
		<HMfilterDropdown :filterData="filterData" :defaultSelected="defaultSelected" @confirm="confirm" :updateMenuName="true"></HMfilterDropdown>
		<device-iist :devicelist="devicelist"></device-iist>
	</view>
</template>

<script>
	import DeviceList from "../device/childComps/DeviceList.vue"
	import poent from "@/common/poent.js"
	import HMfilterDropdown from "@/components/common/HM-filterDropdown.vue"
	export default {
		data() {
			return {
				colid: '',
				devicelist: [],
				filterData: [{
						"name": '地区',
						"type": 'radio',
						"iconName":"ditu2",
						"submenu": [{
							'name': "地区",
							'submenu': []
						}]
					},
					{
						"name": '类别',
						"type": 'hierarchy-column',
						"iconName":"ziyuan29",
						"submenu": []
					},
					{
						"name": '筛选',
						"type": 'radio',
						"iconName":"shaixuan",
						"submenu": [{
							'name': "筛选",
							'submenu': []
						}, ]
					},
				],
				defaultSelected: [],
				pagesize: 8,
				sbqyshow: "",
				yycj: "",
			}
		},
		onLoad() {
			this.device()
			this.Pratype()
		},
		onReachBottom() {
			this.pagesize = this.pagesize + 8
			this.device()

		},
		methods: {
			async device() {
				let params = {
					cmd: 'nDevice_list_proc',
					para: {
						"pageindex": 1,
						"pagesize": this.pagesize,
						"sbqyshow": this.sbqyshow,
						"colid": this.colid,
						"yycj": this.yycj
					}
				}
				const res = await this.$u.api.device(params)
				this.devicelist = res.Data.Data
				for (var value of this.devicelist.values()) {
					value.img = this.baseUrl + value.img
					value.sbqy = value.sbqy.slice(0, 2)
					value.sbqy = poent.filter(item => item.value == value.sbqy)[0].name
				}
			},
			async Pratype() {
				let params = {
					cmd: 'nDevice_list_proc',
					para: {
						"pageindex": 1,
					}
				}
				let paramsc = {
					cmd: 'nSceneColumn_list',
					para: {
						"pageindex": 1,
					}
				}
				const res = await this.$u.api.PraDetails(params)
				this.type = res.Data.Datas3
				this.type = this.type.filter(item => item.pid == 0)
				for (var value of this.type.values()) {
					value.submenu = res.Data.Datas3.filter(item => item.pid == value.id)
					for (var value of value.submenu.values()) {
						value.submenu = res.Data.Datas3.filter(item => item.pid == value.id)
					}
				}
				const yycjData = await this.$u.api.PraDetails(paramsc)
				// console.log(poent)
				this.filterData[0].submenu[0].submenu = poent
				this.filterData[1].submenu = this.type
				this.filterData[1].submenu = JSON.parse(JSON.stringify(this.type).replace(/id/g, "value"))
				this.filterData[2].submenu[0].submenu = JSON.parse(JSON.stringify(yycjData.Data.Data).replace(/id/g, "value"))
			},
			confirm(e) {
				console.log(e.value)
				this.colid = e.value[1][e.value.length - 1] ? e.value[1][e.value.length - 1] : e.value[1][e.value.length - 2]
				this.sbqyshow = e.value[0][0][0] ? e.value[0][0][0] + "0000" : ""
				this.yycj = e.value[2][0][0] ? e.value[2][0][0] : ""
				this.device()
			},
			change(index) {
				this.sbqyshow = index + "0000"
				this.region = this.options1.filter(item => item.value == index)[0].label
			},
		},
		components: {
			"device-iist": DeviceList,
			'HMfilterDropdown': HMfilterDropdown
		}
	}
</script>

<style scoped lang="scss">
	/deep/.u-cell {
		width: 124rpx;
		padding: 20rpx 10rpx;
	}

	/deep/.u-cell-item-box {
		display: flex;
		flex-wrap: wrap;
	}

	/deep/.u-cell__value {
		display: none;
	}
</style>
